﻿<DropdownButton OnClick='e => { Console.WriteLine("Click on left button."); }'>
    <Overlay>
        @_overlayMenu
    </Overlay>
    <ChildContent>
        Dropdown
    </ChildContent>
</DropdownButton>
<DropdownButton Icon="user">
    <Overlay>
        @_overlayMenu
    </Overlay>
    <ChildContent>
        Dropdown
    </ChildContent>
</DropdownButton>
<DropdownButton OnClick='e => { Console.WriteLine("Click on left button."); }' Disabled="@true">
    <Overlay>
        @_overlayMenu
    </Overlay>
    <ChildContent>
        Dropdown
    </ChildContent>
</DropdownButton>
<Tooltip Title="@("tooltip")">
    <Unbound>
        <DropdownButton ButtonsRender="ButtonsRender" RefBack="@context" Icon="loading">
            <Overlay>
                @_overlayMenu
            </Overlay>
            <ChildContent>
                With ToolTip
            </ChildContent>
        </DropdownButton>
    </Unbound>
</Tooltip>
<Dropdown>
    <Overlay>
        @_overlayMenu
    </Overlay>
    <ChildContent>
        <Button>Button <Icon Type="down" /></Button>
    </ChildContent>
</Dropdown>

@code
{
private RenderFragment _overlayMenu =@<Menu>
    <MenuItem>
        <a target="_blank" rel="noopener noreferrer" href="http://www.alipay.com/">
            1st menu item
        </a>
    </MenuItem>
    <MenuItem>
        <a target="_blank" rel="noopener noreferrer" href="http://www.taobao.com/">
            2nd menu item
        </a>
    </MenuItem>
    <MenuItem>
        <a target="_blank" rel="noopener noreferrer" href="http://www.tmall.com/">
            3rd menu item
        </a>
    </MenuItem>
</Menu>; 

private RenderFragment ButtonsRender(RenderFragment leftButton, RenderFragment rightButton)
{
return @<Template>
    <span>@leftButton</span>
    @rightButton
</Template>;
}


}